const state = {
    showConfigPanel: false, // 是否显示配置面板
    showToolPanel: true, // 是否显示工具面板
    //
    curComponentId: null,
    curComponentIndex: null,
    curVariableKey: null,
    curComponentVariable: null,
    curComponentName: '',
    curEditorForm: null,
    // 
    componentList: [], // 栏目模板选择的所有组件
    categoryVariable: {}, // 栏目模板的所有变量
    componentId: '', // 当前编辑的组件id
    componentKey: '', // 当前编辑的组件componentKey
    componentVariable: {}, // 当前编辑的组件的所有变量
    componentVariableDefault: {}, // 当前编辑的组件的所有变量默认值
    editorKey: '', // 当前编辑的元素key
    editorVariable: {}, // 当前编辑的元素变量 
    editorVariableDefault: {}, // 当前编辑的元素变量默认值
    // 
    headVariable: {},
    headComponentList: {},
    footVariable: {},
    footComponentList: {},
    editorDom: null
}

// 这里包含了大量的引用赋值，看不懂变化就挨着断点好吧
const mutations = {
    SET_CONFIG: (state, data) => {
        state.curComponentId = data.curComponentId
        state.curComponentIndex = data.curComponentIndex
        state.curComponentName = data.curComponentName
        state.curComponentVariable = data.curComponentVariable
        state.curVariableKey = data.curVariableKey
        state.curEditorForm = data.curComponentVariable[data.curComponentName][data.curVariableKey] //引用对象，改editorForm等于改curComponentVariable，到时候直接提交curComponentVariable
    },
    // 栏目模板选择的所有组件
    SET_COMPONENT_LIST(state, data) {
        state.componentList = data
    },
    // 设置栏目变量
    SET_CATEGORY_VARIABLE(state, data) {
        state.categoryVariable = data
    },
    // 设置当前编辑组件的变量默认值
    SET_COMPONENT_VARIABLE_DEFAULT(state, data){
        state.componentVariableDefault = data
    },
    // 设置当前编辑组件的变量(更新组件的时候，往往是传递组件的所有元素变量给后端)一定要先调用默认值设置，再调用这个
    SET_COMPONENT_VARIABLE(state, {id, key}){
        state.componentKey = key
        state.componentId = id
        state.componentVariable = state.categoryVariable[key] // 当前复合组件的所有变量，包括每个可编辑元素的变量。
        // 深度合并，以 componentVariable 值为准
        const mergeDefaults = (target, defaults) => {
            for (const key in defaults) {
                if (!(key in target)) {  // 只在 target 没有该属性时才从 defaults 中获取
                    target[key] = typeof defaults[key] === 'object' && !Array.isArray(defaults[key])
                        ? {}  // 如果是对象，创建空对象继续递归
                        : defaults[key]  // 如果是基本类型，直接使用默认值
                }
                if (typeof defaults[key] === 'object' && !Array.isArray(defaults[key])) {
                    mergeDefaults(target[key], defaults[key])
                }
            }
        }
        mergeDefaults(state.componentVariable, state.componentVariableDefault)
    },
    // 设置当前编辑元素的变量
    SET_EDITOR_VARIABLE(state, key){
        state.editorKey = key
        try {
            if(key.includes('.')){
                const keys = key.split('.')
                let current = state.componentVariable
                let defaultCurrent = state.componentVariableDefault
                for (const k of keys) {
                    current = current[k] ? current[k] : {type: 'common'}
                    defaultCurrent = defaultCurrent[k] ? defaultCurrent[k] : {type: 'common'}
                }
                state.editorVariableDefault = defaultCurrent
                state.editorVariable = current
            } else {
                state.editorVariableDefault = state.componentVariableDefault[key]
                state.editorVariable = state.componentVariable[key]
            }
        } catch (error) {
            console.error(error)
        }
    },
    // 设置是否显示配置面板
    SET_SHOW_CONFIG_PANEL(state, data){
        if (data && state.showConfigPanel) {
            state.showConfigPanel = false
            state.showConfigPanel = true
        } else {
            state.showConfigPanel = data
        }
    },
    // 设置是否显示工具面板
    SET_SHOW_TOOL_PANEL(state, data){
        state.showToolPanel = data
        if (data) {
            state.showConfigPanel = false
        }
    },
    // 当前编辑的元素dom对象
    SET_EDITOR_DOM(state, data){
        state.editorDom = data
    }
}

const actions = {
    
}

export default {
    namespaced: true, //命名空间
    state,
    mutations,
    actions,
}
